<template>
	<view>
		<comHeader :config="navConfig" />
		<view class="main">
			<view class="mainheader">
					<view class="headertitle" @tap="reservation">取号中，请等待...</view>
					<view class="prompt">等待时长视商家网络情况稍有差别</view>
			</view>
			<view class="floatleft lineboerder">
				<view class="linetitle">餐桌类型</view>
				<view class="linetitle">等待餐桌</view>
				<view class="linetitle">预计等待</view>
			</view>
			<view class="floatleft" v-for="(info,index) in datalist" :key="index">
				<view class="foreachpadding">{{info.title}} <text class="ofclass">{{info.numberof}}</text> </view>
				<view class="foreachpadding"> <text class="zhuocolor">{{info.numberdata}}</text> <text class="ofclass">卓</text>
				</view>
				<view class="foreachpadding"> <text class="timecolor">{{info.time}}</text> <text class="ofclass">分钟</text> </view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				maamselected: false,
				sirselected: false,
				datalist: [{
						title: "大桌",
						numberdata: "2",
						time: "1",
						numberof: "(1-4人)"
					},
					{
						title: "大桌",
						numberdata: "2",
						time: "1",
						numberof: "(1-4人)"
					},
				],
				navConfig: {
					isFixed: false,
					comScroll: 0,
					left: {
						text: '',
						isShowLeft: true,
						leftGobackColor: '#ffffff',
						leftTextColor: '',
					},
					mid: {
						isShowMid: true,
						text: '新韩小馆烤肉'
					},
					right: {
						text: '',
						isShowRight: false,
					}
				},
			}
		},
		methods:{
			reservation(){
				uni.navigateTo({
					url:"lineLineSuccess"
				})
			}
		}
	}
</script>

<style>
	.main {
		padding-top: 150upx;
	}
	
	.mainheader{
		border-top: 10upx solid #F5F5F5;
		border-bottom: 10upx solid #F5F5F5;
	}
	.headertitle{
		padding: 54upx 0upx 26upx 0upx;
		text-align: center;
		font-size: 32upx;
	}
	.prompt{
		padding-bottom:50upx;
		text-align: center;
		font-size: 24upx;
		color: #999999;
	}
	.floatleft {
		width: 80%;
		display: flex;
		text-align: center;
		font-size: 26upx;
		margin: auto;
	}
	.lineboerder {
		border-bottom: 1px solid #DCDCDC;
	}

	.linetitle {
		width: 33%;
		padding: 39upx 0upx 26upx 0upx;
	}

	.foreachpadding {
		width: 33%;
		padding: 40upx 0upx 0upx 0upx;
	}

	.zhuocolor {
		color: #1965C5;
	}

	.ofclass {
		color: #999999;
	}
</style>
